<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>缤格</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/swiper.min.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/common.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/binge.css"/>
    <script type="text/javascript" src="../../script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../../script/swiper.min.js"></script>
    <script type="text/javascript" src="../../script/laydate/laydate.js"></script>
    <script type="text/javascript" src="../../script/mobile.js"></script>
    <script type="text/javascript">
        window['adaptive'].desinWidth = 750;
        window['adaptive'].baseFont = 28;
        window['adaptive'].maxWidth = 750;
        window['adaptive'].init();
    </script>
</head>

<body>
<!-- header -->
<div id="header" style="height: 0.9rem; background: #fff; position: fixed; top: 0;left: 0; width: 100%; z-index: 99">
    <div class="header">
        <div class="head-back">
            <a href="javascript:void(0);" tapmode onclick="comeBack()">取消</a>
        </div>
        <div class="head-title">
            <h6>发布需求</h6>
        </div>
        <!--<div class="head-action">-->
        <!--<a href="javascript:void(0);" tapmode >发布</a>-->
        <!--</div>-->
    </div>
</div>
<!-- header end -->
<div class="header-h" style="padding-top: 1.5rem;"></div>
<div class="activity-section">
    <div class="activity-title">
        <input type="text" id="title" minlength="4" maxlength="50" placeholder="输入需求主题，2-25字">
    </div>
    <div class="activity-detail">
        <div class="textarea" tapmode onclick="getHtml()">
            <div class="textareaInput" id="content"><p class="c-999">点击输入内容</p></div>
            <div class="textareaModel"></div>
        </div>
        <!--<textarea readonly tapmode onclick="getHtml()" name="" id="content" cols="30" rows="10"-->
                  <!--placeholder="Uni小提示：请输入详细信息以提高大家的参与度哦~如：活动具体地点，开始到结束的时间段，大家的集合时间、地点等等。如需进群，可放置进群二维码哦~"></textarea>-->
        <div class="txt">Uni小提示：请输入详细信息以提高大家的参与度哦~如：具体地点，开始到结束的时间段，大家的集合时间、地点等等。如需进群，可放置进群二维码哦~</div>

        <ul id="icons">
            <!--<li>-->
            <!--<img src="../../image/img-media01.png" alt="">-->
            <!--<div class="delete"></div>-->
            <!--</li>-->
            <li class="choose-pic" id="choosePic" tapmode onclick="showVideo()">
                <div class="pic-icon">上传视频</div>
            </li>
            <li class="choose-pic" id="deleteVideo" style="display: none;" tapmode onclick="deleteVideo(this)">
                <div class="delete-icon">移出视频</div>
            </li>
        </ul>
        <div class="contentVideo">
            <!--<video class="video-js mb20" preload="true" controls="false" data-setup="{}" src="http://app.unicia.com.cn//static/uploads_file/20200323/12f3fc92da3e6309c29bda0ae4d8a680.mp4" poster="http://app.unicia.com.cn//static/uploads/2020-03-23/mind91777c15f089bc4755572972caecf03.png"><source src="http://app.unicia.com.cn//static/uploads_file/20200323/12f3fc92da3e6309c29bda0ae4d8a680.mp4" type="video/mp4" /></video>-->
        </div>
    </div>

    <div class="fill-info">
        <ul>
            <li>
                <p class="label">报名截止时间</p>
                <div class="label-input">
                    <input type="text" readonly class="chooseTime" id="signUpTime">
                </div>
            </li>
            <li>
                <p class="label">需求开启时间</p>
                <div class="label-input">
                    <input type="text" readonly class="chooseTime" id="startTime">
                </div>
            </li>
            <li>
                <p class="label">需求结束时间</p>
                <div class="label-input">
                    <input type="text" readonly class="chooseTime" id="endTime">
                </div>
            </li>
            <li>
                <p class="label">费用 <em class="f24 c-999">(每人金额)</em></p>
                <div class="label-input">
                    <input type="text" class="fill-address" id="cost" placeholder="无费用请填 “无”">
                </div>
            </li>
            <li>
                <p class="label">地点</p>
                <!--<div class="label-input" onclick="getAddress()">-->
                <div class="label-input">
                    <input type="text" id="address" class="fill-address" value="" placeholder="请输入地址">
                    <!--<a href="javascript:void(0)" class="address-icon"></a>-->
                </div>
            </li>
            <li>
                <p class="label">发起人</p>
                <div class="label-input">
                    <!--<span id="release_user">LUCK</span>-->
                    <input type="text" id="launch_people" class="fill-address" placeholder="请输入发起人名称">
                </div>
            </li>
            <li>
                <p class="label">联系方式</p>
                <div class="label-input">
                    <input type="text" id="user_tel" class="fill-address" placeholder="请输入联系方式">
                </div>
            </li>
            <li>
                <p class="label">人数</p>
                <div class="label-input" style="position: relative;">
                    <!--<input type="number" style="position: absolute;z-index: 9; opacity: 1;" class="fill-address"-->
                           <!--id="person" placeholder="请输入活动人数" maxlength="4">-->
                    <input type="number"  oninput="if(value.length>4)value=value.slice(0,4)" class="fill-address" id="num" maxlength="4" placeholder="请输入需求人数">
                </div>
            </li>
        </ul>
    </div>


    <div class="activity-choose-item">
        <h6>点击选择需填信息</h6>
        <ul class="item-con" id="editInfo" data-type="1">
            <!--<li class="on">姓名</li>
            <li>手机号</li>
            <li>学校</li>
            <li>所在组织</li>-->
        </ul>
        <div class="add-li">
            <a href="javascript:void(0);" class="add-btn">添加自定义</a>
            <p>没有合适的，可以添加自定义</p>
        </div>
    </div>
    <div class="activity-choose-item">
        <h6>需求类型</h6>
        <ul class="item-con" id="act_kinds" data-type="2">
            <!--<li>国庆长假</li>
            <li>音乐</li>
            <li>下棋</li>-->
        </ul>
        <div class="add-li">
            <a href="javascript:void(0);" class="add-btn">添加自定义</a>
            <p>没有合适的，可以添加自定义</p>
        </div>
    </div>

    <div class="common-fixed-bottom">
        <a href="javascript:void(0);" topmode onclick="releaseActivity()" class="fixed-bottom">确定</a>
    </div>
</div>


<!-- 时间选择器-->
<div class="model" style="display: none">
    <div class="model-time" id="modelTime"></div>
</div>
<!-- 时间选择器 end-->

</body>

</html>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<link rel="stylesheet" type="text/css" href="../../script/videoJs/video-js.min.css"/>
<!--<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet"  type="text/css"/>-->
<script type="text/javascript" src="../../script/videoJs/video.min.js"></script>
<script type="text/javascript">
    var circle_id = '';//圈子id
    var user_tel = '';//用户电话
    var icons = [];//上传的图片
    var information = '';//需要填写的信息
    var cut = '';//活动类型
	var addressname ="";
	var lon ="";
	var lat ="";
	var void_id = '';
	var void_icon = '';
	var void_icon_path = '';

    apiready = function () {

        setFixStatusBar(); //设置状态栏

        keybackListener()
        circle_id = api.pageParam.circle_id;
        // circle_id = 366;

        var userInfo = $api.getStorage('userInfo');

        //获取所需填写信息
        get_information();
		
		// //获取定位权限
		// var resultList = api.hasPermission({
		// 	list: ['location'],
		// 	// list: ['location','camera','storage','contacts']
		// });
		// if (resultList[0].granted) {
		// } else {
		// 	api.requestPermission({
		// 		list: ['location'],
		// 		code: 1
		// 	}, function(ret, err) {
		//
		// 	});
		// }
		
		//监听选择地址
		api.addEventListener({
		    name: 'release_activity'
		}, function (ret, err) {
			console.log(JSON.stringify(ret.value))
			addressname =ret.value.val;
			console.log(ret.value.val)
			lon =ret.value.lon;
			lat =ret.value.lat;
		    $('#address').val(ret.value.val)
		});

    };

    function getHtml() {

        var content = $("#content").html();
        if(content == '<p class="c-999">点击输入内容</p>'){
            content = "";
        }
        console.log(content)
        checkSystemType(function () {
            //ios
            var bgft = api.require('BGFT');
            bgft.showAlert({
                content: content
            },function(ret, err) {
                if (ret){
                    console.log('ret:'+JSON.stringify(ret));
                    if(ret == ''){
                        $("#content").html('<p class="c-999">点击输入内容</p>')

                    }else {
                        $("#content").html(ret)
                    }
                }else {
                    console.log('err:'+JSON.stringify(err));
                }

            });
        },function () {
            //android
            // release_invitation('../school/release_invitation')
            var p = {
                content: content
            }
            console.log(jsonChange(p))
            var htmlEditor = api.require('htmlEditorSdk');
            htmlEditor.startHtmlEditor(p,function(ret, err) {
                console.log(JSON.stringify(ret));

                if (ret){
                    console.log(JSON.stringify(ret));
                    if(ret.result == ''){
                        $("#content").html('<p class="c-999">点击输入内容</p>')

                    }else {
                        $("#content").html(ret.result)
                    }
                }else {
                    console.log(JSON.stringify(err));
                }

            });
        });
    }


    function getAddress() {
        var param = {
            type: 1
        }
        commonUrl('../activity/choose_map',param)


    }

    /*$("#person").on('input', function () {
        var _this = $(this);
        if (_this.val() == '') {
            $("#num").val('')
        } else if (_this.val() == 0) {
            pop.notice('活动人数不能为0')
            _this.val('');
        }  else if (_this.val() > 10000) {
            pop.notice('活动人数不能大于9999')
            _this.val(9999);
        } else {
            $("#num").val(_this.val() + '人')
        }
    })*/

    //提交活动信息
    function releaseActivity() {
        var icons_ids = icons.join(',');
        var content = $('#content').html();
        if(content == '<p class="c-999">点击输入内容</p>'){
            content = '';
        }

        var param = {
            token: $api.getStorage('token'),
            circle_id: circle_id,
            title: $('#title').val(),
            content: content,
            icons: icons_ids,
            sign_time: $("#signUpTime").val(),
            start_time: $("#startTime").val(),
            end_time: $("#endTime").val(),
            cost: $("#cost").val(),
            address: $("#address").val(),
            launch_people: $("#launch_people").val(),
            tel: $("#user_tel").val(),
            number: $('#num').val(),
            information: information,
            cut: cut,
			log:lon,
			lat:lat,
            void_id: void_id,
            void_icon: void_icon,
        }
        if (!isDefine(param.title) || !isDefine(param.content) || !isDefine(param.sign_time) || !isDefine(param.start_time) || !isDefine(param.end_time) || !isDefine(param.cost) || !isDefine(param.address) || !isDefine(param.launch_people) || !isDefine(param.tel) || !isDefine(param.number) || !isDefine(param.information) || !isDefine(param.cut)) {
            pop.notice('请完善需求信息');
            return;
        }
        /*if(!regTel(param.tel)){
            pop.notice('联系方式格式不对');
            return;
        }*/
        pop.loading();
        getAjax(Interface.set_activity, param, function (res) {

            pop.notice(res.msg);
            pop.close();
            setTimeout(function () {
                comeBack();
                api.sendEvent({
                    name: 'activity',
                    extra: {}
                });
                api.sendEvent({
                    name: 'memberInfo',
                    extra: {}
                });
            },2000)
        }, function (error) {
            pop.notice(error.msg);
            pop.close();
        })
    }



    var arrInfo = [];////选择所需填写信息
    var arrCut = [];////选择活动类型
    $(".item-con").on('click', 'li', function () {
        var _this = $(this);
        var type = _this.parents('.item-con').attr('data-type');
        var id = _this.attr('data-id');
        if (type == 1) {
            if (isDefine(id)) {
                if (_this.hasClass('on')) {
                    _this.removeClass('on');
                    arrInfo.splice($.inArray(id, arrInfo), 1);
                } else {
                    _this.addClass('on');
                    arrInfo.push(id);
                }
                information = arrInfo.join(',');
                console.log(information)
            }
        } else {
            if (isDefine(id)) {
                if (_this.hasClass('on')) {
                    _this.removeClass('on');
                    arrCut.splice($.inArray(id, arrCut), 1);
                } else {
                    _this.addClass('on');
                    arrCut.push(id);
                }
                cut = arrCut.join(',');
                console.log(cut)
            }
        }


    });
    //添加
    $(".add-btn").click(function () {
        $(this).parents('.add-li').siblings(".item-con").append('<li data-id=""><input class="editInput" type="text" placeholder="填写标签"></li>')
    });

    $(".item-con").on('input', '.editInput', function () {
        var _this = $(this);
        _this.parents('li').attr('data-id', _this.val());
    });
    $(".item-con").on('blur', '.editInput', function () {
        var _this = $(this);
        if (_this.val() == '') {
            _this.parents('li').remove();
        } else {
            _this.attr('readonly', true);
        }
    });


    //获取所需填写信息
    function get_information() {
        var param = {
            token: $api.getStorage('token')
        }
        getAjax(Interface.get_act_info, param, function (res) {
            var data = res.data;
            if (isDefine(data.information)) {
                var inforHtml = '';
                for (var i = 0; i < data.information.length; i++) {
                    inforHtml += '<li data-id="' + data.information[i].id + '">' + data.information[i].title + '</li>'
                }
                $("#editInfo").html(inforHtml)
            } else {
                $("#editInfo").html('<p class="t-c c-999">暂无所需填写信息</p>>')
            }
            if (isDefine(data.cut)) {
                var cutHtml = '';
                for (var i = 0; i < data.cut.length; i++) {
                    cutHtml += '<li data-id="' + data.cut[i].id + '">' + data.cut[i].title + '</li>'
                }
                $("#act_kinds").html(cutHtml)

            } else {
                $("#act_kinds").html('<p class="t-c c-999">暂无活动类型</p>>')
            }

        }, function (error) {
            pop.notice(error.msg)
        })
    }


    var _timeModel = $(".model");
    var _varId = '', _chooseTime = '';
    $(".chooseTime").click(function () {
        var _this = $(this);
        _varId = _this.attr('id');
        _timeModel.fadeIn();
    });

    laydate.render({
        elem: '#modelTime', //指定元素
        position: 'static',
        type: 'datetime',
        trigger: 'click',
        format: 'yyyy-MM-dd HH:mm',
        btns: ['now', 'confirm'],
        done: function (value) {
            console.log(value);
            _chooseTime = value;
        }
    });
    //确定时间，关闭弹窗
    $(".laydate-btns-confirm").click(function () {
        $('#' + _varId).val(_chooseTime);
        _timeModel.fadeOut();
    });

    _timeModel.on('click', function (e) {
        _timeModel.fadeOut();
    })

    //视频上传
    function showVideo() {

        api.actionSheet({
            title: '上传视频',
            cancelTitle: '取消',
            buttons: ['拍摄','选择视频']
        }, function (ret, err) {
            if (ret) {
                getVideo(ret.buttonIndex);
            }
        });
    }

    function getVideo(sourceType) {
        if (sourceType == 2) { // 从相机中选择
            var ISphoen = api.systemType;
            var UIAlbumBrowser = api.require('UIAlbumBrowser');
            UIAlbumBrowser.open({
                max: 1,
                type: 'video',
                isOpenPreview: false,
                classify: false,
                styles: {
                    bg: '#fff',
                    mark: {
                        icon: '',
                        position: 'bottom_left',
                        size: 20
                    },
                    nav: {
                        bg: 'rgba(0,0,0,0.6)',
                        titleColor: '#fff',
                        titleSize: 18,
                        cancelColor: '#fff',
                        cancelSize: 16,
                        finishColor: '#fff',
                        finishSize: 16
                    }
                },
                rotation: true
            }, function (ret) {
                // alert(JSON.stringify(ret));
                if (ret.eventType == "cancel") {
                    pop.notice("取消了操作！")
                    return;
                }
                var dt = ret.list;

                api.showProgress({
                    title: '正在上传...',
                    modal: true
                });
                if (ret) {
                    if (ISphoen == "ios") {
                        // for (var i in dt) {

                        UIAlbumBrowser.transPath({
                            path: ret.list[0].path
                        }, function (ret, err) {
                            if (ret) {
                                // alert(JSON.stringify(ret));
                                console.log(ret.path)
                                var ListVideoSec = ret.path;
                                api.ajax({
                                    url: ajaxUrl + Interface.upload_file,
                                    method: 'post',
                                    data: {
                                        files: {
                                            'file': ret.path,
                                        }
                                    }
                                }, function (ret, err) {
                                    console.log(JSON.stringify(ret))
                                    if (ret) {

                                        if (ret.code == 200) {
                                            //arrimg.push(ret)
                                            api.hideProgress();
                                            addVideos(ret.icon, ajaxUrl + ret.path, ListVideoSec);
                                        } else {
                                            api.hideProgress();
                                            api.toast({
                                                msg: ret.msg,
                                                location: 'middle'
                                            });
                                        }
                                    } else {

                                        api.hideProgress();
                                        api.toast({
                                            msg: err.msg,
                                            location: 'middle'
                                        });
                                    }
                                });
                            }
                        });
                        // }
                    } else {
                        var ListVideoSec = ret.list[0].path;
                        // for (var i in dt) {
                        api.ajax({
                            url: ajaxUrl + Interface.upload_file,
                            method: 'post',
                            data: {
                                files: {
                                    'file': ret.list[0].path,
                                }
                            }
                        }, function (ret, err) {
                            console.log(JSON.stringify(ret))
                            if (ret) {

                                if (ret.code == 200) {
                                    //arrimg.push(ret)
                                    api.hideProgress();
                                    addVideos(ret.icon, ajaxUrl + ret.path, ListVideoSec);
                                } else {
                                    api.hideProgress();
                                    api.toast({
                                        msg: ret.msg,
                                        location: 'middle'
                                    });
                                }
                            } else {
                                api.hideProgress();
                                api.toast({
                                    msg: err.msg,
                                    location: 'middle'
                                });
                            }
                        });


                        // }
                    }
                }
            });

        } else if (sourceType == 1) {
            //拍摄视频
            api.getPicture({
                sourceType: 'camera',
                encodingType: 'png',
                mediaValue: 'video',
                allowEdit: false,
                videoQuality: 'high',
                destinationType: 'url',
                saveToPhotoAlbum: true
            }, function (ret, err) {
                var ISphoen = api.systemType;
                if (ISphoen == "ios") {
                    if (ret == '') {
                        return;
                    }
                } else {
                    if (ret.data == '') {
                        return;
                    }
                }
                if (ret) {

                    var imgSrc = ret.data;
                    if (imgSrc != "") {

                        //$api.attr(ele, 'src', imgSrc);
                    }
                    api.showProgress({
                        title: '正在上传...',
                        modal: true
                    });
                    // api.hideProgress();
                    var ele = $api.dom('#paishe');
                    api.ajax({
                        url: ajaxUrl + Interface.upload_file,
                        method: 'post',
                        data: {
                            files: {
                                'file': ret.data,
                            }
                        }
                    }, function (ret, err) {
                        //  alert(JSON.stringify(ret));
                        if (ret) {
                            if (ret.code == 200) {

                                api.hideProgress();
                                addVideos(ret.icon, ajaxUrl + ret.path, imgSrc);

                            } else {
                                api.hideProgress();
                                api.toast({
                                    msg: ret.msg,
                                    location: 'middle'
                                });
                            }
                        } else {

                            api.hideProgress();
                            api.toast({
                                msg: err.msg,
                                location: 'middle'
                            });
                        }
                    });


                }
            });
        }
    }

    function addVideos(id, videoPath, bdvideopath) {

        var videoScreenshots = api.require('videoScreenshots');
        var timestamp = new Date().getTime();
        videoScreenshots.screenshots({
            videoUrl: bdvideopath,//视频url
            time: 1,
            name: timestamp
        }, function (ret) {
            if (ret.status == true) {
                console.log(JSON.stringify(ret));
                console.log(id);
                console.log(videoPath);

                void_id = id;//上传之后的视频id

                //上传图片
                uploadImg(ret.path,function (res) {
                    void_icon = res.icon;
                    void_icon_path = ajaxUrl + res.path;
                    console.log(void_icon)
                    console.log(void_icon_path)

                    var html = '<video class="video-js mb20" preload="true" controls="false" data-setup="{}" src="'+ videoPath+'" poster="'+ ajaxUrl + res.path +'"><source src="'+ videoPath +'" type="video/mp4" /></video>';
                    console.log(html)
                    $(".contentVideo").html(html);
                    $("#deleteVideo").show();
                    getVideoJs();
                },1)

            }
        });
    }


    //删除图片
    function deleteVideo(that) {
        var _this = $(that);
        _this.hide();
        void_id = '';
        void_icon = '';
        $(".contentVideo").html('');
    }




</script>
